<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=\, initial-scale=1.0">
    <title>我的</title>
</head>

<body class="dpflex fdc">
    <div class="main flex1">
        <!-- 头像区域 -->
        <div class="portrait dpflex">
            <img alt="" class="portrait-img" id="headImg">
            <p class="my-msg dpflex" id="myInfo">
                <span class="nick-name" id="nickName"></span>
                <i class="iconfont icon-next"></i>
            </p>
            <p class="autograph">个性签名：<span id="signature"></span></p>
            <input type="file" name="" id="upload" class="upload">
        </div>
        <!-- 个人动态 -->
        <div class="personal dpflex">
            <p class="por">
                <i class="iconfont icon-msg"></i>
                <span class="personal-text poa">个人动态</span>
            </p>
            <p>
                <span class="strip"><span id="personalNum"></span>条</span>
                <i class="iconfont icon-next"></i>
            </p>
        </div>
        <!-- 运动数据 -->
        <div class="motion-info">
            <p class="clearfix por" id="toMySportsData">
                <i class="iconfont icon-data fl"></i>
                <span class="motion-text fl poa">运动数据</span>
                <i class="iconfont icon-next fr"></i>
            </p>
            <div class="motion-data clearfix">
                <p class="total-motion fl dpflex fdc">
                    <span class="text">总运动</span>
                    <span><span class="num" id="totalNum"></span>分钟</span>
                </p>
                <p class="consume fr dpflex fdc">
                    <span class="text">本周消耗</span>
                    <span><span class="num" id="consumeNum"></span>千卡</span>
                </p>
            </div>
        </div>
        <!-- 运动徽章 -->
        <div class="badge-wall">
            <p class="clearfix por" id="toMyBadge">
                <i class="iconfont icon-huizhang fl"></i>
                <span class="badge-text fl poa">我的运动徽章</span>
                <i class="iconfont icon-next fr"></i>
            </p>
            <div class="dpflex badge-imgbox">
                <p class="badge-img"><img src="../img/mybadge01.jpg" alt=""></p>
                <p class="badge-img"><img src="../img/mybadge02.jpg" alt=""></p>
                <p class="badge-img"><img src="../img/mybadge03.jpg" alt=""></p>
            </div>
        </div>
        <!-- 退出登录按钮 -->
        <p class="log-out" id="logOutBtn">退出登录</p>
    </div>
    <div id="footer"></div>

    <!--  引入axios -->
    <script src="https://cdn.bootcdn.net/ajax/libs/axios/0.21.1/axios.min.js"></script>
</body>

</html>